<template>
    <div class="bg">
   <topNav :txt="txt" :mode="2" ></topNav>
   <div class="search_box">
       <van-icon name="search" size="20"  color='#999999'/>
       <span>搜索</span>
   </div>
   <div class="tip_title">公司员工名单</div>
   <div class="main">
       <div class="list" v-for="(item,index) in 10" :key="index" @click="skips()"><span>阿明</span></div>
   </div>
   <div class="rigth_box"><span v-for="item in list" :key="item">{{item}}</span></div>

    </div>
</template>
<script>
import topNav from "@/components/return"

export default {
       components: {
    topNav
  },
  data() {
    return {
        txt:'总日表',
        show:false,
         actions:[{name:'设置签到时间',id:1}
         ],
         list:['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','#']
    };
  },
   methods: {
      
     
    skips(path){
    this.$router.push({path:'/ribao',query:{
        name:'阿明'
    }})
    }
    
       
  },
}
</script>
<style  scoped>
.bg{
    min-height:100vh ;
     background: #EDEDED;
}
.search_box{
    margin:10px 20px;
    padding: 5px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius:20px ;
    color: #999999;
}
.search_box span{
    margin-left: 5px;
}
.tip_title{
    margin:10px 20px;
    color: #999999;
    font-size: 14px;

}
.main{
    background: #fff;
    padding-left: 20px;
}
.list{
    display: flex;
    align-items: center;
    height: 40px;
    border-bottom: 1px solid #e3e4e5;
}
.rigth_box{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: 20px;
    top: 20%;
     /* transform: translate(-50%, -45%); */
     color: #7D7D7D;
     font-size: 10px;
     
}
.van-action-sheet__item {
    line-height: 22px;
    color: red;
}
</style>